<template>
  <div>
    <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect()" router>


      <!-- <el-menu-item index="1" :route="{path:'/allMessages',query:{nClass:'新闻'}}">节气</el-menu-item>
      <el-menu-item index="2" :route="{path:'/allMessages',query:{nClass:'通知'}}">环境</el-menu-item>
      <el-menu-item index="3" :route="{path:'/allMessages',query:{nClass:'重要信息'}}">旅游</el-menu-item> -->
      <el-menu-item index="1" :route="{path:'/allMessages',query:{nClass:'节气'}}">节气</el-menu-item>
      <el-menu-item index="2" :route="{path:'/allMessages',query:{nClass:'环境'}}">环境</el-menu-item>
      <el-menu-item index="3" :route="{path:'/allMessages',query:{nClass:'旅游'}}">旅游</el-menu-item>
      <el-menu-item index="4" :route="{path:'/allMessages',query:{nClass:'生态'}}">生态</el-menu-item>
      <el-menu-item index="5" :route="{path:'/allMessages',query:{nClass:'气象科普'}}">气象科普</el-menu-item>

      <!--    <el-menu-item v-for="o in categories" :key="o.value" :index="o.value">{{ o.category }}</el-menu-item>-->
      <!--    <el-menu-item index="2">处理中心</el-menu-item>-->
      <!--    <el-menu-item index="3" disabled>消息中心</el-menu-item>-->
      <!--    <el-menu-item index="4"><a href="https://www.ele.me" target="_blank">订单管理</a></el-menu-item>-->
    </el-menu>
    <router-view :key="key"></router-view>
  </div>
</template>

<script>
export default {
  name: "ManuComponent",
  data() {
    return {
      activeIndex: "1",
      categories: [
        {category: '节气', value: '1'},
        {category: '环境', value: '2'},
        {category: '旅游', value: '3'},
        {category: '生态', value: '4'},
        {category: '气象科普', value: '5'},
      ]
    }
  },
  computed: {
    key() {
      return this.$route.path + Math.random();
    }
  },

  methods: {
    handleSelect(key, keyPath) {
      console.log(key)
      console.log(keyPath)
      // this.$router.push({
      //   path: key,
      //   params: {data: 'query' }
      // })
    }
  },
  mounted() {
    // this.$router.push({
    //   path:"/allMessages",
    //   query:{
    //     nClass:'新闻'
    //   }
    // });
  }

}

</script>

<style scoped>

</style>
